<!DOCTYPE html>
<!--
    This test ensures that reparented overlay scrollbars are positioned
    correctly when the compositing container and the ancestor compositing
    stacking context differ.
-->
<script>
if (window.internals) {
    internals.useMockOverlayScrollbars();
    internals.settings.setPreferCompositingToLCDTextEnabled(true);
}
</script>
<style>
#container {
  margin-right: auto;
  margin-left: auto;
  width: 1200px;
}

.hidden {
  overflow: hidden;
}

#positioned {
  position: relative;
  overflow: hidden;
  width: 1200px;
  height: 800px;
}

#scroller {
  overflow: scroll;
  width: 1200px;
  height: 1000px;
}

#background {
  background: green;
  height: 10000px;
}

#foreground {
  position: relative;
}
</style>
<script>
if (window.testRunner)
  testRunner.dumpAsText();

onload = function() {
  if (window.internals) {
    document.getElementById('console').innerHTML = internals.layerTreeAsText(document);
  }
}
</script>
<div id="container">
  <div class="hidden">
    <div id="positioned">
      <div class="hidden">
        <div id="scroller">
          <div id="background"></div>
          <div id="foreground"></div>
        </div>
      </div>
    </div>
  </div>
</div>
<pre id="console"></pre>
